<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		DOM 文档对象模型 -- 页面  操作页面的数据
		BOM 浏览器对象模型 --- 浏览器 
		<!-- 
		 DOM 能干啥
		 1、获取标签
		 2、操作元素的内容
		 3、操作标签的属性
		 4、操作标签的样式（css）
		 5、元素的事件操作
		 -->
		 
		 <div class="demo">
			 我是测试文字
			 <img src="img/ganlai.gif" alt="" width="100">
			 <a href="">aaaaa</a>
		 </div>
		 <div class="demo2"></div>
		
		 <script type="text/javascript">
		 	/*	innerText 
					获取内容：获取的是标签中纯文本内容
					设置内容：设置内容时，也是只作为纯文本展示，不会解析标签
			*/
			// 获取 元素
			var demo = document.querySelector(".demo")
			var demo2 = document.querySelector(".demo2")
			
			// 获取demo中的内容
			var text =  demo.innerText
			console.log(text)
			console.log(typeof text)
			
			// 设置demo2的内容
			demo2.innerText = text
			// demo2.innerText = '<a href="">aaaaa</a>'
			
		 </script>
	</body>
</html>
